<template>
  <ElRadioGroup v-bind="getAttrs">
    <ElRadio
      v-for="(item, index) in options"
      :key="index"
      :label="item[labelName]"
      :name="item[valueName]"
      :disabled="item[disabledName]"
      :border="border"
    ></ElRadio>
  </ElRadioGroup>
</template>

<script setup lang="ts" name="RadioGroup">
import { ElRadioGroup, ElRadio } from "element-plus";
import { computed, PropType, useAttrs } from "vue";
import { RadioProps } from "./type";
import { omit } from "lodash";
defineProps({
  options: {
    type: Array as PropType<RadioProps[]>,
    default: () => []
  },
  valueName: {
    type: String,
    default: "value"
  },
  labelName: {
    type: String,
    default: "label"
  },
  disabledName: {
    type: String,
    default: "disabled"
  },
  border: {
    type: Boolean,
    default: false
  }
});
const attrs = useAttrs();
const getAttrs = computed(() => {
  return omit(attrs, ["valueName", "labelName", "disabledName", "border"]);
});
</script>

<style scoped></style>
